<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">

	<h:head>
		<title>Testing Persist Route with Constraints</title>
		<h:outputScript library="js" name="jquery-ui.custom.min.js"></h:outputScript>
		<h:outputScript library="js" name="jquery.js"></h:outputScript>
		<h:outputScript library="js" name="jquery-1.4.4.min.js"></h:outputScript>
		
		<h:outputStylesheet library="css" name="blitzer/jquery-ui-1.8.10.custom.css"></h:outputStylesheet>
		
		<script>
		
		$( function() {
				
				$("#createRouteButton").click( 
				 function() {
					$("#dialogBox").dialog( { modal: true } );
				 }
				
				);
				
			});
		
		
		</script>
	</h:head>
	
	<h:body>
		<h:form id="newRouteForm" prependId="false">
			<fieldset>
				<h:message for="newRouteForm" binding="#{routeForm.formMessage}"></h:message>
			</fieldset>		
			
			<fieldset>
				<ol>
					<li>
						<h:outputLabel for="fromCity" value="From City:"></h:outputLabel>
						<h:inputText id="fromCity" value="#{routeForm.routeBean.fromCity}"></h:inputText>
						<h:message for="fromCity"></h:message>
					</li>
					
					<li>
						<h:outputLabel for="toCity" value="To City:"></h:outputLabel>
						<h:inputText id="toCity" value="#{routeForm.routeBean.toCity}"></h:inputText>
						<h:message for="toCity"></h:message>				
					</li>			
				</ol>
			</fieldset>
			
			<fieldset>
				<h:commandButton action="#{routeForm.createRoute}" id="createRouteButton" value="Create Route"></h:commandButton>
			</fieldset>	
		</h:form>
	</h:body>
</html>